<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>淘宝网-淘！我喜欢</title>
    <link rel="stylesheet" href="./css/bootstrap.min.css">
    <link rel="stylesheet" href="./font/iconfont.css">
    <link rel="stylesheet" href="./css/home.css">
    
</head>

<body>
    <div class="web-shop">
        <!-- 头部导航条 -->
        <div class="header">
            <div class="container">
                <ul class="nav">
                    <li>
                        <a href="javascript:;" class="arrow">中国大陆</a>
                    </li>
                    <li class="orange">
                        <a href="javascript:;">亲，请登录</a>
                    </li>
                    <li>
                        <a href="javascript:;">免费注册</a>
                    </li>
                    <li>
                        <a href="javascript:;">手机逛淘宝</a>
                    </li>
                </ul>
                <ul class="nav">
                    <li>
                        <a href="javascript:;" class="arrow">我的淘宝</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="arrow">购物车</a>
                    </li>
                    <li>
                        <span class="start" class="arrow"></span>
                        <a href="javascript:;">收藏夹</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="arrow">商品分类</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="arrow">卖家中心</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="arrow">联系客服</a>
                    </li>
                    <li>
                        <a href="javascript:;" class="arrow">网站导航</a>
                    </li>
                </ul>
            </div>
        </div>

        <div class="body-1">
            <!-- 搜索框 -->
            <div class="search">
                <div class="search-logo">
                    <a href="https://www.taobao.com/"></a>
                </div>
                <div class="search-box">
                    <ul class="search-tab">
                        <a href="javascript:;" class="choose1">淘宝</a>
                        <a href="javascript:;">天猫</a>
                        <a href="javascript:;">店铺</a>
                    </ul>
                    <form class="search-input">
                        <input class="box1" type="text" name="search">
                        <button class="btn" type="submit">搜索</button>
                    </form>

                    <div class="search-choose">
                        <a href="javascript:;">新款连衣裙</a>
                        <a href="javascript:;">四件套</a>
                        <a href="javascript:;" class="tx">潮流T恤</a>
                        <a href="javascript:;">时尚女鞋</a>
                        <a href="javascript:;">短裤</a>
                        <a href="javascript:;">半身裙</a>
                        <a href="javascript:;">男士外套</a>
                        <a href="javascript:;">墙纸</a>
                        <a href="javascript:;">新款男鞋</a>
                        <a href="javascript:;">耳机</a>
                    </div>
                </div>
                <div class="search-code">
                    <a href="javascript:;">
                        <!-- <img src="./img/jnh.png" alt=""> -->
                        <!-- <a href="https://www.taobao.com?spm=a21bo.2017.201857.1.5af911d9kqNdIn"></a> -->
                        <a href="https://img.alicdn.com/tfs/TB18W1cQFXXXXaWXXXXXXXXXXXX-160-160.png"></a>
                    </a>
                </div>
            </div>
            <!-- 导航栏 -->
            <ul class="nav">
                <li class="left-nav">主题市场</li>
                <li class="li">天猫</li>
                <li class="li">聚划算</li>
                <li class="li">|</li>
                <li class="li">天猫商城</li>
                <li class="li">司法拍卖</li>
                <li class="li">淘宝心选</li>
                <li class="li">|</li>
                <li class="li">飞猪旅行</li>
                <li class="li">智能生活</li>
                <li class="li">苏宁易购</li>
            </ul>
            <!-- 内容区域 -->
            <div class="shop" id="">
                <!-- 左侧功能条 -->
                <ul class="left-items" id="left-items">
                    <li class="left-items-li">
                        <a href="javascript:;">女装</a> /
                        <a href="javascript:;">男装</a> /
                        <a href="javascript:;">内衣</a>
                    </li>
                    <li class="left-items-li">
                        <a href="javascript:;">鞋靴</a> /
                        <a href="javascript:;">箱包</a> /
                        <a href="javascript:;">配件</a>

                    </li>
                    <li class="left-items-li">
                        <a href="javascript:;">童装</a> /
                        <a href="javascript:;">孕产</a> /
                        <a href="javascript:;">玩具</a>

                    </li>
                    <li class="left-items-li">
                        <a href="javascript:;">女装</a> /
                        <a href="javascript:;">男装</a> /
                        <a href="javascript:;">内衣</a>

                    </li>
                    <li class="left-items-li">
                        <a href="javascript:;">女装</a> /
                        <a href="javascript:;">男装</a> /
                        <a href="javascript:;">内衣</a>

                    </li>
                    <li class="left-items-li">
                        <a href="javascript:;">女装</a> /
                        <a href="javascript:;">男装</a> /
                        <a href="javascript:;">内衣</a>

                    </li>
                    <li class="left-items-li">
                        <a href="javascript:;">女装</a> /
                        <a href="javascript:;">男装</a> /
                        <a href="javascript:;">内衣</a>

                    </li>
                    <li class="left-items-li">
                        <a href="javascript:;">女装</a> /
                        <a href="javascript:;">男装</a> /
                        <a href="javascript:;">内衣</a>

                    </li>
                    <li class="left-items-li">
                        <a href="javascript:;">女装</a> /
                        <a href="javascript:;">男装</a> /
                        <a href="javascript:;">内衣</a>

                    </li>
                    <li class="left-items-li">
                        <a href="javascript:;">女装</a> /
                        <a href="javascript:;">男装</a> /
                        <a href="javascript:;">内衣</a>

                    </li>
                    <li class="left-items-li">
                        <a href="javascript:;">女装</a> /
                        <a href="javascript:;">男装</a> /
                        <a href="javascript:;">内衣</a>

                    </li>
                    <li class="left-items-li">
                        <a href="javascript:;">女装</a> /
                        <a href="javascript:;">男装</a> /
                        <a href="javascript:;">内衣</a>

                    </li>
                    <li class="left-items-li">
                        <a href="javascript:;">女装</a> /
                        <a href="javascript:;">男装</a> /
                        <a href="javascript:;">内衣</a>

                    </li>
                    <li class="left-items-li">
                        <a href="javascript:;">女装</a> /
                        <a href="javascript:;">男装</a> /
                        <a href="javascript:;">内衣</a>

                    </li>
                    <div class="left-items-content" id="left-items-content">

                    </div>
                </ul>
                <!-- 图片展示区 -->
                <div class="img-box">
                    <div>
                        <!-- <img src="./img/tu1.jpg" alt=""> -->
                        <img src="https://aecpm.alicdn.com/simba/img/TB183NQapLM8KJjSZFBSutJHVXa.jpg" alt="">
                        <!-- <img src="./img/tu2.jpg" alt=""> -->
                        <img src="https://img.alicdn.com/tps/i4/TB188PkAfb2gK0jSZK9SuuEgFXa.jpg_q90_.webp" alt="">
                    </div>
                    <div>
                        <!-- <img src="./img/tu3.jpg" alt=""> -->
                        <img src="https://img.alicdn.com/imgextra/i2/30625/O1CN01kDhfXV1GUI8EsyjtC_!!30625-0-lubanu.jpg_290x290q90.jpg_.webp" alt="">
                        <!-- <img src="./img/tu4.jpg" alt=""> -->
                        <img src="https://img.alicdn.com/tps/i4/TB1VQLbsy_1gK0jSZFqSuwpaXXa.jpg_240x240q90.jpg" alt="">
                        
                    </div>
                </div>
                <!--信息展示区-->
                <div class="tu-right">
                    <div class="right-icon">
                        <!-- <img src="./img/hi.png" alt=""> -->
                        <img src="https://wwc.alicdn.com/avatar/getAvatar.do?userNick=&width=50&height=50&type=sns&_input_charset=UTF-8" alt="">
                    </div>
                    <div class ="right-btn">
                        <a href="login.html">登录</a>
                        <a href="register.html">注册</a>
                        <a href="list.html">了解详情</a>
                    </div>
                    <!-- <div class="page-header">
                        <h1><small>欢迎<span class="text-primary"></span>，<a href="javascript:;" class="btn btn-warning logout">退出</a></small></h1>
                    </div> -->
                    <div class="right-warn">网上有害信息举报专区</div>
                    <div class="right-info">
                        <ul class="info-top">
                            <li><a href="javascript:;">公告</a></li>
                            <li><a href="javascript:;">规则</a></li>
                            <li><a href="javascript:;">论坛</a></li>
                            <li><a href="javascript:;">安全</a></li>
                            <li><a href="javascript:;">公益</a></li>
                        </ul>
                        <ul class="info-bottom">
                            <li>公益阿里、腾讯等六家公司同台联合做公益</li>
                            <li>淘宝造物节之城市秘密、聚划算88红包省钱卡</li>
                        </ul>
                    </div>
                    <ul class="right-rechage">
                        <li><a class="icon icon-1" href="javascript:;"></a>
                            <p>充话费</p>
                        </li>
                        <li><a class="icon icon-2" href="javascript:;"></a>
                            <p>旅行</p>
                        </li>
                        <li><a class="icon icon-3" href="javascript:;"></a>
                            <p>车险</p>
                        </li>
                        <li><a class="icon icon-4" href="javascript:;"></a>
                            <p>游戏</p>
                        </li>
                        <li><a href="javascript:;" class="icon icon-1"></a>
                            <p>充话费</p>
                        </li>
                        <li><a href="javascript:;" class="icon icon-2"></a>
                            <p>旅行</p>
                        </li>
                        <li><a href="javascript:;" class="icon icon-3"></a>
                            <p>车险</p>
                        </li>
                        <li><a href="javascript:;" class="icon icon-4"></a>
                            <p>游戏</p>
                        </li>
                        <li><a href="javascript:;" class="icon icon-1"></a>
                            <p>充话费</p>
                        </li>
                        <li><a href="javascript:;" class="icon icon-2"></a>
                            <p>旅行</p>
                        </li>
                        <li><a href="javascript:;" class="icon icon-3"></a>
                            <p>车险</p>
                        </li>
                        <li><a href="javascript:;" class="icon icon-4"></a>
                            <p>游戏</p>
                        </li>
                        <li><a href="javascript:;" class="icon icon-1"></a>
                            <p>充话费</p>
                        </li>
                        <li><a href="javascript:;" class="icon icon-2"></a>
                            <p>旅行</p>
                        </li>
                        <li><a href="javascript:;" class="icon icon-3"></a>
                            <p>车险</p>
                        </li>
                        <li><a href="javascript:;" class="icon icon-4"></a>
                            <p>游戏</p>
                        </li>
                    </ul>
                </div>
            </div>
        </div>

        <div class="body-2">
            <div class="item">
                <div class="title">
                    <!-- <img src="./img/body-2-logo-1.jpg" alt=""> -->
                    <img src="https://img.alicdn.com/tfs/TB1tqpnegMPMeJjy1XcXXXpppXa-148-48.png" alt="">
                    <span>与品质生活不期而遇</span>
                </div>
                <div class="content">
                    <div class="content-item">
                        <!-- <img src="./img/body-2-baby-1.png" alt=""> -->
                        <img src="https://img.alicdn.com/imgextra/i3/783537643/TB2SfeAkwKTBuNkSne1XXaJoXXa_!!783537643-2-beehive-scenes.png_180x180xzq90.jpg_.webp" alt="">
                        <p class="desc1">小狗图案不锈钢皂</p>
                        <p class="desc2">小狗图案不锈钢皂</p>
                        <p class="desc3">13673人说好</p>
                    </div>
                    <div class="content-item">
                        <!-- <img src="./img/body-2-baby-2.png" alt=""> -->
                        <img src="https://img.alicdn.com/imgextra/i1/2645215035/TB2y.PZcGQoBKNjSZJnXXaw9VXa_!!2645215035-0-beehive-scenes.jpg_180x180xzq90.jpg_.webp" alt="">
                        <p class="desc1">小狗图案不锈钢皂</p>
                        <p class="desc2">小狗图案不锈钢皂</p>
                        <p class="desc3">13673人说好</p>
                    </div>
                    <div class="content-item">
                        <!-- <img src="./img/body-2-baby-3.png" alt=""> -->
                        <img src="https://img.alicdn.com/bao/uploaded/TB2BnymXX95V1Bjy0FdXXc5BVXa_!!664782798-0-goldwindow.jpg_180x180xzq90.jpg_.webp" alt="">
                        <p class="desc1">小狗图案不锈钢皂</p>
                        <p class="desc2">小狗图案不锈钢皂</p>
                        <p class="desc3">13673人说好</p>
                    </div>
                </div>
                <div class="content">
                    <div class="content-item">
                        <!-- <img src="./img/body-2-baby-1.png" alt=""> -->
                        <img src="https://img.alicdn.com/imgextra/i4/1022433859/O1CN01qkuVDn1eNSuEj5e6u_!!1022433859-0-beehive-scenes.jpg_180x180xzq90.jpg_.webp" alt="">
                        <p class="desc1">小狗图案不锈钢皂</p>
                        <p class="desc2">小狗图案不锈钢皂</p>
                        <p class="desc3">13673人说好</p>
                    </div>
                    <div class="content-item">
                        <!-- <img src="./img/body-2-baby-2.png" alt=""> -->
                        <img src="https://img.alicdn.com/imgextra/i1/2645215035/TB2y.PZcGQoBKNjSZJnXXaw9VXa_!!2645215035-0-beehive-scenes.jpg_180x180xzq90.jpg_.webp" alt="">
                        <p class="desc1">小狗图案不锈钢皂</p>
                        <p class="desc2">小狗图案不锈钢皂</p>
                        <p class="desc3">13673人说好</p>
                    </div>
                    <div class="content-item">
                        <!-- <img src="./img/body-2-baby-3.png" alt=""> -->
                        <img src="https://img.alicdn.com/imgextra/i1/2869961377/O1CN011M2hr0zicuS08Hz_!!2869961377-0-beehive-scenes.jpg_180x180xzq90.jpg_.webp" alt="">
                        <p class="desc1">小狗图案不锈钢皂</p>
                        <p class="desc2">小狗图案不锈钢皂</p>
                        <p class="desc3">13673人说好</p>
                    </div>
                </div>
            </div>
            <div class="item">
                <div class="title">
                    <!-- <img src="./img/body-2-logo-1.jpg" alt=""> -->
                    <img src="https://img.alicdn.com/tfs/TB1UNX2bSFRMKJjy0FhXXX.xpXa-112-46.png" alt="">
                    <span>献给聪明可爱的你</span>
                </div>
                <div class="content">
                    <div class="content-item">
                        <!-- <img src="./img/body-2-baby-1.png" alt=""> -->
                        <img src="https://img.alicdn.com/imgextra/i4/1022433859/O1CN01qkuVDn1eNSuEj5e6u_!!1022433859-0-beehive-scenes.jpg_180x180xzq90.jpg_.webp" alt="">
                        <p class="desc1">小狗图案不锈钢皂</p>
                        <p class="desc2">小狗图案不锈钢皂</p>
                        <p class="desc3">13673人说好</p>
                    </div>
                    <div class="content-item">
                        <!-- <img src="./img/body-2-baby-2.png" alt=""> -->
                        <img src="https://img.alicdn.com/imgextra/i1/2869961377/O1CN011M2hr0zicuS08Hz_!!2869961377-0-beehive-scenes.jpg_180x180xzq90.jpg_.webp" alt="">
                        <p class="desc1">小狗图案不锈钢皂</p>
                        <p class="desc2">小狗图案不锈钢皂</p>
                        <p class="desc3">13673人说好</p>
                    </div>
                    <div class="content-item">
                        <!-- <img src="./img/body-2-baby-3.png" alt=""> -->
                        <img src="https://img.alicdn.com/tfscom/i1/1581756766/TB2TF0ch0zJ8KJjSspkXXbF7VXa_!!1581756766.jpg_180x180xzq90.jpg_.webp" alt="">
                        <p class="desc1">小狗图案不锈钢皂</p>
                        <p class="desc2">小狗图案不锈钢皂</p>
                        <p class="desc3">13673人说好</p>
                    </div>
                </div>
                <div class="content">
                    <div class="content-item">
                        <!-- <img src="./img/body-2-baby-1.png" alt=""> -->
                        <img src="https://img.alicdn.com/bao/uploaded/TB28TQ1nrBmpuFjSZFAXXaQ0pXa_!!2996832334.png_180x180xzq90.jpg_.webp" alt="">
                        <p class="desc1">小狗图案不锈钢皂</p>
                        <p class="desc2">小狗图案不锈钢皂</p>
                        <p class="desc3">13673人说好</p>
                    </div>
                    <div class="content-item">
                        <!-- <img src="./img/body-2-baby-2.png" alt=""> -->
                        <img src="https://img.alicdn.com/bao/uploaded/TB2jH_uoFXXXXXfXpXXXXXXXXXX_!!0-dgshop.jpg_180x180xzq90.jpg_.webp" alt="">
                        <p class="desc1">小狗图案不锈钢皂</p>
                        <p class="desc2">小狗图案不锈钢皂</p>
                        <p class="desc3">13673人说好</p>
                    </div>
                    <div class="content-item">
                        <!-- <img src="./img/body-2-baby-3.png" alt=""> -->
                        <img src="https://img.alicdn.com/bao/uploaded/TB2i9iuoFXXXXbPXpXXXXXXXXXX_!!0-juitemmedia.jpg_180x180xzq90.jpg_.webp" alt="">
                        <p class="desc1">小狗图案不锈钢皂</p>
                        <p class="desc2">小狗图案不锈钢皂</p>
                        <p class="desc3">13673人说好</p>
                    </div>
                </div>
            </div>
        </div>

        <div class="body-3">
            <h1 class="title-h1">
                <div class="icon"></div>热卖单品
            </h1>
            <div class="content">
                <div class="item">
                    <!-- <img src="./img/body-3-1.png" alt=""> -->
                    <img src="https://img.alicdn.com/bao/uploaded/i4/315520326/TB2MTiLs1uSBuNjSsziXXbq8pXa_!!315520326.jpg_200x200q90.jpg_.webp" alt="">
                    <p class="desc-1">纯棉男女军绿色t恤2018新款宽松韩版初秋长</p>
                    <p class="desc-2">评价：17705 收藏：6875</p>
                    <p></p>
                </div>
                <div class="item">
                    <!-- <img src="./img/body-3-1.png" alt=""> -->
                    <img src="https://img.alicdn.com/bao/uploaded/i4/315520326/TB2MTiLs1uSBuNjSsziXXbq8pXa_!!315520326.jpg_200x200q90.jpg_.webp" alt="">
                    <p class="desc-1">纯棉男女军绿色t恤2018新款宽松韩版初秋长</p>
                    <p class="desc-2">评价：17705 收藏：6875</p>
                    <p></p>
                </div>
                <div class="item">
                    <!-- <img src="./img/body-3-1.png" alt=""> -->
                    <img src="https://img.alicdn.com/bao/uploaded/i4/315520326/TB2MTiLs1uSBuNjSsziXXbq8pXa_!!315520326.jpg_200x200q90.jpg_.webp" alt="">
                    <p class="desc-1">纯棉男女军绿色t恤2018新款宽松韩版初秋长</p>
                    <p class="desc-2">评价：17705 收藏：6875</p>
                    <p></p>
                </div>
                <div class="item">
                    <!-- <img src="./img/body-3-1.png" alt=""> -->
                    <img src="https://img.alicdn.com/bao/uploaded/i4/315520326/TB2MTiLs1uSBuNjSsziXXbq8pXa_!!315520326.jpg_200x200q90.jpg_.webp" alt="">
                    <p class="desc-1">纯棉男女军绿色t恤2018新款宽松韩版初秋长</p>
                    <p class="desc-2">评价：17705 收藏：6875</p>
                    <p></p>
                </div>
                <div class="item">
                    <!-- <img src="./img/body-3-1.png" alt=""> -->
                    <img src="https://img.alicdn.com/bao/uploaded/i4/315520326/TB2MTiLs1uSBuNjSsziXXbq8pXa_!!315520326.jpg_200x200q90.jpg_.webp" alt="">
                    <p class="desc-1">纯棉男女军绿色t恤2018新款宽松韩版初秋长</p>
                    <p class="desc-2">评价：17705 收藏：6875</p>
                    <p></p>
                </div>
                <div class="item">
                    <!-- <img src="./img/body-3-1.png" alt=""> -->
                    <img src="https://img.alicdn.com/bao/uploaded/i4/315520326/TB2MTiLs1uSBuNjSsziXXbq8pXa_!!315520326.jpg_200x200q90.jpg_.webp" alt="">
                    <p class="desc-1">纯棉男女军绿色t恤2018新款宽松韩版初秋长</p>
                    <p class="desc-2">评价：17705 收藏：6875</p>
                    <p></p>
                </div>
                <div class="item">
                    <!-- <img src="./img/body-3-1.png" alt=""> -->
                    <img src="https://img.alicdn.com/bao/uploaded/i4/315520326/TB2MTiLs1uSBuNjSsziXXbq8pXa_!!315520326.jpg_200x200q90.jpg_.webp" alt="">
                    <p class="desc-1">纯棉男女军绿色t恤2018新款宽松韩版初秋长</p>
                    <p class="desc-2">评价：17705 收藏：6875</p>
                    <p></p>
                </div>
                <div class="item">
                    <!-- <img src="./img/body-3-1.png" alt=""> -->
                    <img src="https://img.alicdn.com/bao/uploaded/i4/315520326/TB2MTiLs1uSBuNjSsziXXbq8pXa_!!315520326.jpg_200x200q90.jpg_.webp" alt="">
                    <p class="desc-1">纯棉男女军绿色t恤2018新款宽松韩版初秋长</p>
                    <p class="desc-1">评价：17705 收藏：6875</p>
                    <p></p>
                </div>
                <div class="item">
                    <!-- <img src="./img/body-3-1.png" alt=""> -->
                    <img src="https://img.alicdn.com/bao/uploaded/i4/315520326/TB2MTiLs1uSBuNjSsziXXbq8pXa_!!315520326.jpg_200x200q90.jpg_.webp" alt="">
                    <p class="desc-1">纯棉男女军绿色t恤2018新款宽松韩版初秋长</p>
                    <p class="desc-2">评价：17705 收藏：6875</p>
                    <p></p>
                </div>
                <div class="item">
                    <!-- <img src="./img/body-3-1.png" alt=""> -->
                    <img src="https://img.alicdn.com/bao/uploaded/i4/315520326/TB2MTiLs1uSBuNjSsziXXbq8pXa_!!315520326.jpg_200x200q90.jpg_.webp" alt="">
                    <p class="desc-1">纯棉男女军绿色t恤2018新款宽松韩版初秋长</p>
                    <p class="desc-2">评价：17705 收藏：6875</p>
                    <p></p>
                </div>
            </div>
        </div>

        <div class="footer">
            <div class="item">
                <h2 class="title">消费者保证</h2>
                <div>
                    <span>保障范围</span>
                    <span>退货退款流程</span>
                    <span>服务中心</span>
                    <span>更多特色服务</span>
                </div>
            </div>
            <div class="item">
                <h2 class="title">消费者保证</h2>
                <div>
                    <span>保障范围</span>
                    <span>退货退款流程</span>
                    <span>服务中心</span>
                    <span>更多特色服务</span>
                </div>
            </div>
            <div class="item">
                <h2 class="title">消费者保证</h2>
                <div>
                    <span>保障范围</span>
                    <span>退货退款流程</span>
                    <span>服务中心</span>
                    <span>更多特色服务</span>
                </div>
            </div>
            <div class="item">
                <h2 class="title">消费者保证</h2>
                <div>
                    <span>保障范围</span>
                    <span>退货退款流程</span>
                    <span>服务中心</span>
                    <span>更多特色服务</span>
                </div>
            </div>
        </div>
    </div>
<script src="./js/home.js"></script>
</body>
<script src="./js/cookie.js"></script>

</html>
